<template>
  <div app-container>
    <el-row type="flex" justify="center">
      <el-col :span="21">
        <div align="center" style="background-color: lightgray; height: 60px">
          <div>
            <span id="mainTitle">产品信息</span>
          </div>
        </div>
      </el-col>
    </el-row>
    <el-row justify="center" type="flex">
      <el-col :span="20">
        <div align="left">
          <p class="title">产品基本信息</p>
          <el-form label-position="right" label-width="80px">
            <el-row justify="center">
              <el-col :span="12" type="flex">
                <el-form-item label="产品类型">
                  <el-input v-model="productType"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="产品名称">
                  <el-input v-model="info.productName"/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row justify="center">
              <el-col :span="12" type="flex">
                <el-form-item label="产品来源">
                  <el-input v-model="productOrre"/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-form-item label="产品描述">
              <el-input v-model="productDis"/>
            </el-form-item>
          </el-form>
          <hr />
        </div>
      </el-col>
    </el-row>
    <el-row justify="center" type="flex">
      <el-col :span="20">
        <div align="left">
          <p class="title">还款方式&利率</p>
          <el-form label-position="right" label-width="120px">
            <el-row justify="center">
              <el-col :span="12">
                <el-form-item label="还款方式">
                  <el-input v-model="reimbursements"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="利率计算周期">
                  <el-input v-model="interestRates"/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-form-item label="设置期数&利率">
              <el-row
                v-for="(credit, index) in creditOption"
                :key="credit.key"
                justify="center"
                :prop="'credit.' + index + '.value'"
              >
                <el-col :span="6"> <el-input style="width: 80%" v-model="nums"/>期 </el-col>
                <el-col :span="6">
                  月利率<el-input style="width: 60%" v-model="AnInterest"/>%
                </el-col>
                <el-col :span="6">
                  居间服务费<el-input style="width: 45%" v-model="serviceFee"/>%
                </el-col>
                <el-col :span="2" :offset="1">
                  <el-button type="text" @click="removeLine(credit)"
                    >删除</el-button
                  >
                </el-col>
              </el-row>
            </el-form-item>
            <el-row justify="left" type="flex">
              <el-col :span="1" :offset="4">
                <el-button type="text" @click="addProduct">添加</el-button>
              </el-col>
            </el-row>
          </el-form>
          <hr />
        </div>
      </el-col>
    </el-row>
    <el-row justify="center" type="flex">
      <el-col :span="20">
        <div align="left">
          <p class="title">费用信息</p>
          <el-form
            ref="form"
            label-position="right"
            label-width="125px"
            :model="form"
          >
            <el-form-item label="账单金额是否取整">
              <el-input v-model="accountMoney"/>
            </el-form-item>
            <el-form-item label="提前还款">
              <el-radio-group>
                <el-radio label="渠道商(消费场景，适用消费分期)" />
              </el-radio-group>
            </el-form-item>
            <el-form-item>
              <el-radio-group>
                <el-radio label="渠道商(消费场景，适用消费分期)" />
              </el-radio-group>
            </el-form-item>
          </el-form>
          <hr />
        </div>
      </el-col>
    </el-row>
    <el-row justify="center" type="flex">
      <el-col :span="20">
        <div align="left">
          <p class="title">放款金额限制</p>
          <el-form label-position="right" label-width="130px">
            <el-form-item label="借款支付给">
              <el-radio-group>
                <el-radio label="渠道商(消费场景，适用消费分期)" />
                <el-radio label="贷款人(适用信贷)" />
              </el-radio-group>
            </el-form-item>
            <el-row justify="center">
              <el-col :span="11">
                <el-form-item label="最高申请金额">
                  <el-input style="widows: 20%" v-model="maxMoney"/>
                </el-form-item>
              </el-col>
              <el-col :span="1"><span>元</span></el-col>
              <el-col :span="11">
                <el-form-item label="最低申请金额">
                  <el-input v-model="minMoney"/>
                </el-form-item>
              </el-col>
              <el-col :span="1"><span>元</span></el-col>
            </el-row>
            <el-row justify="center">
              <el-col :span="12">
                <el-form-item label="申请金额校验">
                  <el-input v-model="sqMoney"/>
                </el-form-item>
              </el-col>
              <el-col :span="1" />
              <el-col :span="11">
                <el-form-item label="默认申请金额">
                  <el-input v-model="moMoney"/>
                </el-form-item>
              </el-col>
              <el-col :span="1"><span>元</span></el-col>
            </el-row>
          </el-form>
          <hr />
        </div>
      </el-col>
    </el-row>
    <el-row justify="center" type="flex">
      <el-col :span="20">
        <div align="left">
          <p class="title">审核规则配置</p>
          <el-form label-position="right" label-width="130px">
            <el-row justify="center">
              <el-col :span="12">
                <el-form-item label="审核默认授信金额">
                  <el-input v-model="shMoney"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="审核是否拒绝拉黑">
                  <el-input v-model="shShiFou"/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row justify="center">
              <el-col :span="12">
                <el-form-item label="放贷须过几级审批">
                  <el-input v-model="lending"/>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <hr />
        </div>
      </el-col>
    </el-row>
    <el-row justify="center" type="flex">
      <el-col :span="20">
        <div align="left">
          <p class="title">借款申请配置</p>
          <el-form label-position="right" label-width="130px">
            <el-row justify="center">
              <el-col :span="12">
                <el-form-item label="有未完成借款时继续申请">
                  <el-input v-model="LoanApplication"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="申请人数配置">
                  <el-input v-model="applications"/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row justify="center">
              <el-col :span="12">
                <el-form-item label="产品利率显示">
                  <el-input v-model="productRate"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="还款试算">
                  <el-input v-model="reimbursement"/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-form-item label="产品列表利率文案">
              <el-input v-model="interestRate"/>
            </el-form-item>
            <el-form-item label="贷款用途">
              <el-input v-model="LoansUsed"/>
            </el-form-item>
            <el-row justify="center">
              <el-col :span="12">
                <el-form-item label="用户可放弃申请">
                  <el-input v-model="apply"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="App下载配置">
                  <el-input v-model="app"/>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <hr />
        </div>
      </el-col>
    </el-row>

    <el-row justify="center" type="flex">
      <el-col :span="6" :offset="18">
        <router-link :to="'/production/collaborativeProduct/index'" class="link-type">
        <el-button type="primary" @click="firstTrial">编辑配置</el-button>
      </router-link>
      </el-col>
    </el-row>

  </div>
</template>
  
<script>
import { addProduct } from '@/api/production';
import { findProduct } from '@/api/production';
import { findOne } from '@/api/production';
export default {
  name: 'prostep',
  dicts: ['channel_service_type','channel_channel_type','loan_info_payment_method'],
  data() {
    return {
      reimbursements: "先息后本",
      interestRates: "放款后第二天开始计算利息(T+1)",
      nums: "3",
      AnInterest: "7.0",
      serviceFee: "1.5",
      productType: "信贷",
      productOrre: "小牛金服",
      productDis: "用户纯线上申请，由合作方放款。",
      accountMoney: "不取整",
      maxMoney: "200000.00",
      minMoney: "5000.00",
      sqMoney: "百元的整数倍",
      moMoney: "5000.00",
      shMoney: "借款人申请金额",  
      shShiFou: "否",
      lending: "1级",
      LoanApplication: "不允许",
      applications: "增长系数",
      productRate: "不显示",
      reimbursement: "显示",
      interestRate: "银行放款，额度高，利息低，放款快",
      LoansUsed: "个人消费,装修,旅游,教育,医疗,其他",
      apply: "不允许",
      app: "注册完成后下载App",
      loading: true,
      open: false,
      title: "",
      creditOption: [
        {
          value: "",
        },
      ],
      form: [
        {
        },
      ],
      info: [],
      id: undefined,
    };
    
  },
  created() {
  this.productId = this.$route.params && this.$route.params.productId
  this.getList(this.productId)
},
  methods: {
      getList(productId) {
        findOne(productId).then(res =>{
          console.log(res)
          this.info = res.data

        }).catch()


      },
    removeLine(item) {
      var index = this.creditOption.indexOf(item);
      if (index !== -1) {
        this.creditOption.splice(index, 1);
      }
    },
  },
};
</script>
  
  <style>
#mainTitle {
  font-size: 30px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  float: left;
  height: 60px;
  margin-top: 10px;
}
.title {
  font-size: 30px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #303133;
}
.secondTitle {
  font-size: 20px;
  font-family: Microsoft YaHei;
  font-weight: bolder;
  color: #303133;
  /* background-color: aqua; */
  height: 35px;
}
.con {
  font-size: 20px;
  font-family: Microsoft YaHei;
  font-weight: bolder;
  color: #303133;
}
.long {
  width: 1050px;
  margin-left: 50px;
}

.short {
  margin-left: 50px;
}
</style>
  